<template>
  <div id="app" class="not-select">
    <keep-alive :include="cachePages()">
      <router-view :key="key" />
    </keep-alive>
  </div>
</template>

<script>
export default {
  name: 'App',
  computed: {
    key() {
      // 被 <keep-alive> 缓存的页面 二次进入不会刷新 但有时我们的确需要刷新
      // 那么基于 path 的参数变化 来保证页面再次刷新
      // 如果需要硬性刷新 则跳转时可携带 query 的随机参数
      return this.$route.fullPath
    }
  },
  created() {
    // 如果token存在 则更新用户地区
    if (this.$store.getters.token) {
      // do something...
    }
  },
  methods: {
    // 被 <keep-alive> 缓存的页面
    // 即回退不刷新的效果
    cachePages() {
      const { routes } = this.$router.options
      const pages = []
      routes.forEach(item => {
        if (item.meta && item.meta.cache) {
          pages.push(item.name)
        }
      })
      return pages
    },
  },
}
</script>
